<template>
  <div class="sclass">
    <ul class="sclass1">
      <li class="sclassa" v-for="(item,i) in guid" :key="i">
        {{item.name}}
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  data(){
    return{
      guid:[
        {
          id:1,
          name:"热门推荐",
        },{
          id:2,
          name:"上新推荐",
        },{
          id:3,
          name:"所有商品",
        },
      ]
    }
  }
};
</script>
<style>
.sclass{
  margin: 0 auto;
  width: 6.5rem;
  font-size: 0.22rem;
  line-height:  0.58rem;
  text-align: center;
}
.sclass li{
  width: 33%;
}
.sclass .sclassa{
  background: #f2a83b;
  border-radius: 0.05rem;
}
.sclass1{
  display: flex;
}
</style>